/**
* 头部菜单
*/
<template>
<div id="topheader" class="fb">
  <div class="describe fc">
    <img src="../assets/img/menu/logo.png" alt="" class="logo">
    <title class="name">集运四方</title>
    <img src="../assets/img/menu/ship.png" alt="" class="tag">
  </div>
  <div class="right fb">
    <div class="menu2 fs">
      <router-link to="" class="fs"><img src="../assets/img/menu/guiji.png" alt=""><span class="name">车辆轨迹</span></router-link>
      <router-link to="" class="fs"><img src="../assets/img/menu/hetong.png" alt=""><span class="name">电子合同</span></router-link>
      <router-link to="" class="fs"><img src="../assets/img/menu/order.png" alt=""><span class="name">订单管理</span></router-link>
      <router-link to="" class="fs"><img src="../assets/img/menu/icon40.png" alt=""><span class="name">运单管理</span></router-link>
      <router-link to="" class="fs"><img src="../assets/img/menu/shuju.png" alt=""><span class="name">数据大屏</span></router-link>
    </div>
    <div class="submenu fe">
      <span>平台</span>
      <img src="../assets/img/menu/yonghu.png" alt="" class="head">
      <img src="../assets/img/menu/tuichu.png"  @click="exit()" alt="" class="head signout">
    </div>
  </div>
</div>
</template>
<script>
export default {
  name: 'navcon',
  data() {
    return {
      collapsed: true,
      imgshow: '',
      imgsq: '',
      user: {}
    }
  },
  // 创建完毕状态(里面是操作)
  created() {
  },
  methods: {
    // 退出登录
    exit() {
      this.$router.push({ path: '/login' })
    }
  }
}
</script>
<style lang="scss">
#topheader {
  height: 100%;
  background-color:#2F4050;
  .el-menu--horizontal>.el-submenu .el-submenu__title {
    height: 70px;
    line-height: 70px;
    border-bottom: none;
    font-size: 18px;
  }
  .describe{
    padding-left: 0px;
    min-width: 240px;
    background-color: #293846;
    box-sizing: border-box;
    .tag {
      width: 66px;
    }
  }
  .describe .logo {
    width: 35px;
    vertical-align: middle;
  }
  .describe .name {
    margin-left: 10px;
    font-size: 22px;
    color: #fff;
    display: inline-block;
    line-height: 70px;
  }
  .right {
    width: 100%;
  }
  .menu2 {
    padding-left: 40px;
    img {
      width: 18px;
    }
    span {
      cursor: pointer;
      margin: 0 40px 0 8px;
      font-size:14px;
      color:rgba(255,255,255,0.75);
      &:hover {
        color: #fff;
      }
    }
  }
  .submenu {
    padding-right: 24px;
    float: right;
    span {
      font-size:14px;
      color:rgba(255,255,255,0.75);
    }
    .signout {
      margin-left: 24px;
    }
  }
  .submenu .head {
    cursor: pointer;
    width: 18px;
    margin-left: 18px;
  }
}
</style>